<template>
  <div>
    <el-card class="box-card" style="height:800px">
      <div slot="header" class="clearfix">
        <span>
          <navigation />
        </span>
      </div>
      <el-scrollbar class="page-component__scroll" style="height:100%">
        <div style="height:700px;">
          <el-table
            :header-cell-style="{ background: '#f5f5f5' }"
            class="perTabSty"
            :data="tableData"
            style="width: 100%;margin-bottom: 20px;"
            height="680px"
            row-key="taskId"
            border
            size="small"
            default-expand-all
          >
            <el-table-column prop="name" label="重点工作名称" width="200"></el-table-column>
            <!-- <el-table-column prop="number" label="全年目标任务量"></el-table-column> -->
            <el-table-column align="center" label="一季度得分">
              <el-table-column width="50" align="center" prop="oneDegree" label="完成率得分"></el-table-column>
              <el-table-column width="50" align="center" prop="oneNegativeScore" label="负面清单"></el-table-column>
              <el-table-column width="50" align="center" prop="oneLedgerScore" label="台账扣分"></el-table-column>
              <el-table-column width="50" align="center" prop="oneReduce" label="减分项"></el-table-column>
              <el-table-column width="50" align="center" prop="onePlus" label="加分项"></el-table-column>
              <el-table-column width="100" align="center" prop="oneAllScore" label="总得分"></el-table-column>
            </el-table-column>
            <el-table-column align="center" label="二季度得分">
              <el-table-column width="50" align="center" prop="twoDegree" label="完成率得分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoNegativeScore" label="负面清单"></el-table-column>
              <el-table-column width="50" align="center" prop="twoLedgerScore" label="台账扣分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoReduce" label="减分项"></el-table-column>
              <el-table-column width="50" align="center" prop="twoPlus" label="加分项"></el-table-column>
              <el-table-column width="100" align="center" prop="twoAllScore" label="总得分"></el-table-column>
            </el-table-column>
            <el-table-column align="center" label="三季度得分">
              <el-table-column width="50" align="center" prop="twoDegree" label="完成率得分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoNegativeScore" label="负面清单"></el-table-column>
              <el-table-column width="50" align="center" prop="twoLedgerScore" label="台账扣分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoReduce" label="减分项"></el-table-column>
              <el-table-column width="50" align="center" prop="twoPlus" label="加分项"></el-table-column>
              <el-table-column width="100" align="center" prop="twoAllScore" label="总得分"></el-table-column>
            </el-table-column>
            <el-table-column align="center" label="四季度得分">
              <el-table-column width="50" align="center" prop="twoDegree" label="完成率得分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoNegativeScore" label="负面清单"></el-table-column>
              <el-table-column width="50" align="center" prop="twoLedgerScore" label="台账扣分"></el-table-column>
              <el-table-column width="50" align="center" prop="twoReduce" label="减分项"></el-table-column>
              <el-table-column width="50" align="center" prop="twoPlus" label="加分项"></el-table-column>
              <el-table-column width="100" align="center" prop="twoAllScore" label="总得分"></el-table-column>
            </el-table-column>
            <el-table-column width="100" align="center" prop="taskAllScore" label="全年综合得分"></el-table-column>
          </el-table>
        </div>
      </el-scrollbar>
      <!-- 完成率填报 -->
      <el-dialog
        class="rateDialog"
        width="25%"
        title="完成率填写"
        :visible.sync="dialogRate"
        :close-on-click-modal="false"
        @closed="closeDialogRate"
      >
        <el-form ref="rateRef" :model="rateForm" label-width="100px">
          <el-form-item label="填报类型:">
            <el-switch
              active-color="#13ce66"
              inactive-color="#ff4949"
              v-model="rateForm.type"
              active-text="季度填报"
              inactive-text="月度填报"
              @change="switchChange"
            ></el-switch>
          </el-form-item>
          <el-form-item label="年份：" prop="year">
            <el-date-picker
              v-model="rateForm.year"
              type="year"
              size="small"
              placeholder="选择年"
              style="width:134px"
              value-format="yyyy"
              disabled
            ></el-date-picker>
            <span style="width:120px;" class="striping">
              <i>-</i>
              <b
                style="color:#303133;font-weight: 500;fong-size:12px;"
                v-text="rateForm.type ? '季度' : '月份'"
              ></b>
              <el-select
                v-model="rateForm.time"
                size="small"
                placeholder="请选择"
                style="width:100px;"
                @change="typeTimeChange"
              >
                <el-option
                  v-for="(item, index) in typeTimeList"
                  :key="index"
                  :label="item.name"
                  :value="item.id"
                ></el-option>
              </el-select>
            </span>
          </el-form-item>
          <el-form-item label="目标完成率:">
            <el-input class="rateSize" v-model="rateForm.completeDegree"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button class="saveRateSize" type="primary" @click="onSubmitRate">保存</el-button>
          </el-form-item>
        </el-form>
      </el-dialog>
      <!-- 附件列表弹框 -->
      <el-dialog
        width="60%"
        title="附件列表配置"
        :visible.sync="dialogFormVisible"
        :close-on-click-modal="false"
        @closed="closeDialog"
      >
        <el-form
          :inline="true"
          label-width="95px"
          :model="dutyFrom"
          :hide-required-asterisk="false"
        >
          <el-form-item label="年份：" prop="year">
            <el-date-picker
              class="userIntSize"
              v-model="dutyFrom.year"
              type="year"
              placeholder="选择年"
              value-format="yyyy"
              @change="changeYear"
            ></el-date-picker>
          </el-form-item>
          <el-form-item label="季度：" prop="quarter">
            <el-select class="userIntSize" v-model="dutyFrom.quarter" clearable>
              <el-option
                v-for="(item, index) in quarterList"
                :key="index"
                :label="item.name"
                :value="item.id"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="附件：" prop="file" class="boxCount">
            <el-upload
              class="upload-demo"
              :action="uploadUrl"
              :on-success="successFile"
              :on-remove="handleDealFileRemove"
              :file-list="fileList"
              :limit="1"
            >
              <el-button size="small" type="success">上传附件</el-button>
            </el-upload>
          </el-form-item>
          <el-form-item>
            <el-button size="small" class="saveBtn" type="primary" @click="submitForm">添加</el-button>
          </el-form-item>
        </el-form>
        <el-table :data="fileTableData" border style="width: 100%">
          <el-table-column prop="address" label="附件"></el-table-column>
          <el-table-column prop="date" label="年份"></el-table-column>
          <el-table-column prop="name" label="季度"></el-table-column>
        </el-table>
      </el-dialog>
    </el-card>
  </div>
</template>
<script>
import configJson from "../../api/config";
export default {
  data() {
    return {
      tableData: [],
      dialogFormVisible: false,
      dutyFrom: {
        year: "",
        quarter: "",
        file: "",
      },
      quarterList: [
        { id: 1, name: "第一季度" },
        { id: 2, name: "第二季度" },
        { id: 3, name: "第三季度" },
        { id: 4, name: "第四季度" },
      ],
      mounthList: [
        { id: 1, name: "1月" },
        { id: 2, name: "2月" },
        { id: 3, name: "3月" },
        { id: 4, name: "4月" },
        { id: 5, name: "5月" },
        { id: 6, name: "6月" },
        { id: 7, name: "7月" },
        { id: 8, name: "8月" },
        { id: 9, name: "9月" },
        { id: 10, name: "10月" },
        { id: 11, name: "11月" },
        { id: 12, name: "12月" },
      ],
      typeTimeList: [],
      // 选择附件
      uploadUrl: configJson.API_URL + "fileController/uploadFile",
      fileName: "",
      fileUrlEnd: "",
      fileList: [],
      fileTableData: [],
      dialogRate: false,
      rateForm: {
        type: true,
        year: new Date(),
        time: "",
        completeDegree: "",
        id: "",
        taskId: "",
      },
    };
  },
  mounted() {
    this.getTaskList();
  },
  methods: {
    dataScore(val) {
      let _number = this.floatSub(val.degree, val.ledgerScore);
      _number = this.floatSub(_number, val.reduce);
      _number = this.floatSub(_number, val.negativeScore);
      _number = this.floatAdd(_number, val.plus);
      return _number;
    },
    // 精度计算加
    floatAdd: function (arg1, arg2) {
      var r1, r2, m;
      try {
        r1 = arg1.toString().split(".")[1].length;
      } catch (e) {
        r1 = 0;
      }
      try {
        r2 = arg2.toString().split(".")[1].length;
      } catch (e) {
        r2 = 0;
      }
      m = Math.pow(10, Math.max(r1, r2));
      return (arg1 * m + arg2 * m) / m;
    },
    floatSub: function (arg1, arg2) {
      var r1, r2, m, n;
      try {
        r1 = arg1.toString().split(".")[1].length;
      } catch (e) {
        r1 = 0;
      }
      try {
        r2 = arg2.toString().split(".")[1].length;
      } catch (e) {
        r2 = 0;
      }
      m = Math.pow(10, Math.max(r1, r2));
      //动态控制精度长度
      n = r1 >= r2 ? r1 : r2;
      return ((arg1 * m - arg2 * m) / m).toFixed(n);
    },
    //乘
    floatMul: function (arg1, arg2) {
      var m = 0,
        s1 = arg1.toString(),
        s2 = arg2.toString();
      try {
        m += s1.split(".")[1].length;
      } catch (e) {}
      try {
        m += s2.split(".")[1].length;
      } catch (e) {}
      return (
        (Number(s1.replace(".", "")) * Number(s2.replace(".", ""))) /
        Math.pow(10, m)
      );
    },
    decimal(val) {
      let _val = val * 100;
      _val = _val.toFixed(2);
      return _val + "%";
    },
    // 获取任务列表
    getTaskList() {
      this.$axios
        .post("/taskDegree/getAllScore")
        .then((res) => {
          if (res.code == 200) {
            // this.tableData.forEach((item, index) => {
            //   item.Number = 0;
            //   item.taskCompletionChildVos.forEach((o, i) => {
            //     o.synthesize = this.dataScore(o);
            //   });
            //   if (item.taskCompletionChildVos.length <= 4) {
            //     item.taskCompletionChildVos.push(
            //       {
            //         allScore: "",
            //         awardScore: "",
            //         degree: "",
            //         ledgerScore: "",
            //         negativeScore: "",
            //         plus: "",
            //         reduce: "",
            //         taskId: "",
            //         time: "",
            //         synthesize: 0,
            //       },
            //       {
            //         allScore: "",
            //         awardScore: "",
            //         degree: "",
            //         ledgerScore: "",
            //         negativeScore: "",
            //         plus: "",
            //         reduce: "",
            //         taskId: "",
            //         time: "",
            //         synthesize: 0,
            //       },
            //       {
            //         allScore: "",
            //         awardScore: "",
            //         degree: "",
            //         ledgerScore: "",
            //         negativeScore: "",
            //         plus: "",
            //         reduce: "",
            //         taskId: "",
            //         time: "",
            //         synthesize: 0,
            //       }
            //     );
            //   }
            //   let num1 = this.floatAdd(
            //     item.taskCompletionChildVos[0].synthesize,
            //     item.taskCompletionChildVos[1].synthesize
            //   );
            //   num1 = this.floatAdd(
            //     num1,
            //     item.taskCompletionChildVos[2].synthesize
            //   );
            //   num1 = this.floatMul(num1, 0.2);
            //   let num2 = this.floatMul(
            //     item.taskCompletionChildVos[3].synthesize,
            //     0.4
            //   );
            //   let num3 = this.floatAdd(num1, num2);
            //   item.Number = this.floatMul(num3, 0.8);
            // });
            // let arr = [];
            // res.data.forEach((item, index) => {
            //   arr.push(
            //     item[0].oneAllScore,
            //     item[0].twoAllScore,
            //     item[0].threeAllScore,
            //     item[0].fourAllScore
            //   );
            //   // res.data["YearScoll"] = this.floatMul(eval(arr.join("+")), 0.8);
            // });
            // console.log(arr)
            this.tableData = res.data;
            console.log(this.tableData);
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 查看
    // handleLook(row) {
    //   this.$router.push("/indicatorTaskPlan");
    // },
    switchChange(val) {
      this.rateForm.completeDegree = "";
      this.rateForm.time = "";
      if (val) {
        this.typeTimeList = this.quarterList;
      } else {
        this.typeTimeList = this.mounthList;
      }
    },
    // 完成率填报
    handleRate(row) {
      this.dialogRate = true;
      this.switchChange(this.rateForm.type);
      this.rateForm.taskId = row.id;
    },
    typeTimeChange(val) {
      console.log(val, "val");
      let obj = {
        taskId: this.rateForm.taskId,
        time: this.rateForm.time,
      };
      if (this.rateForm.type) {
        obj.type = 1;
      } else {
        obj.type = 2;
      }
      this.$axios
        .post("taskDegree/load", obj, 2)
        .then((res) => {
          if (res.code == 200) {
            if (res.data) {
              this.rateForm.id = res.data.id;
              this.rateForm.completeDegree = res.data.degree;
            } else {
              this.rateForm.id = "";
              this.rateForm.completeDegree = "";
            }
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 打开附件列表弹框
    handFileList(row) {
      this.dialogFormVisible = true;
    },
    // 选择年
    changeYear(val) {
      this.dutyFrom.year = val.toLocaleDateString();
    },
    // 附件上传成功
    successFile(response, file, fileList) {
      if (response.code == 200) {
        this.fileList = fileList;
        let fileUrlStr = this.uploadUrl.split("/");
        let fileRemoveChl = fileUrlStr.slice(0, fileUrlStr.length - 1);
        this.fileUrlEnd = fileRemoveChl.join("/");
        this.fileName = this.fileUrlEnd + "/" + response.data;
      }
    },
    // 删除附件
    handleDealFileRemove(file, fileList) {
      this.fileList = fileList;
      this.fileName = "";
    },
    submitForm() {
      if (this.dutyFrom.year == "") {
        this.$message.error("请选择年份");
      } else if (this.dutyFrom.quarter == "") {
        this.$message.error("请选择季度");
      } else if (this.fileList.length == 0) {
        this.$message.error("请选择附件");
      }
    },
    closeDialog() {
      this.dutyFrom = {
        year: "",
        quarter: "",
        file: "",
      };
    },
    // 新增权限
    addPerFun(data) {
      this.$axios
        .post("taskDegree/add", data)
        .then((res) => {
          if (res.code == 200) {
            this.$message({
              message: "填报成功",
              type: "success",
            });
            this.getTaskList();
            this.dialogRate = false;
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    // 修改权限
    updataPer(data) {
      this.$axios
        .post("taskDegree/update", data)
        .then((res) => {
          if (res.code == 200) {
            this.$message({
              message: "修改成功",
              type: "success",
            });
            this.getTaskList();
            this.dialogRate = false;
          }
        })
        .catch((err) => {
          console.log(err);
        });
    },
    onSubmitRate() {
      let obj = {
        degree: Number(this.rateForm.completeDegree),
        taskId: this.rateForm.taskId,
        time: this.rateForm.time,
      };
      if (this.rateForm.type) {
        obj.type = 1;
      } else {
        obj.type = 2;
      }
      if (this.rateForm.id) {
        obj.id = this.rateForm.id;
        this.updataPer(obj);
      } else {
        this.addPerFun(obj);
      }
    },
    closeDialogRate() {
      this.rateForm = {
        type: true,
        year: new Date(),
        time: "",
        completeDegree: "",
        id: "",
        taskId: "",
      };
    },
  },
};
</script>
<style scoped>
.rateSize {
  width: 70%;
}
.saveRateSize {
  width: 60%;
  margin-left: 5%;
}
.saveBtn {
  margin-left: 50px;
}
</style>
<style>
.rateDialog .el-dialog__body {
  padding: 30px 0;
}
</style>
